<template>
  <a-button type="primary" @click="onClick">新增角色</a-button>
  <role-drawer
    v-model:open="open"
    v-model:title="title"
    :context-data="propsDrawerData"
    @save="handleSave"
  />
</template>
<script setup>
import { message } from 'ant-design-vue'
import { ref } from 'vue'
import RoleDrawer from './role-drawer.vue'
import { addRole } from '@/api/role.js'
import { useDataSourceManager } from './provide-context.js'
/**
 * 全局数据
 */
let { update } = useDataSourceManager()
let open = ref(false)
let title = ref('新增角色')
let propsDrawerData = ref({})
/**
 * 新增操作
 */
function onClick() {
  open.value = true
  propsDrawerData.value = {
    btnType: 'add',
  }
}
/**
 * 保存操作
 */
async function handleSave(data) {
  try {
    await addRole(data)
    await update()
    message.success('新增成功')
  } catch (e) {
    message.error('新增失败')
  }
}
</script>
